<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>RabbitMQ高并发秒杀</title>

    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/jquery.countdown.min.js}"></script>
    <script th:src="@{/js/sec.js}"></script>

    <script type="text/javascript">
        $(function () {
            var goodsId = [[${goods.id}]];

            var nowTime = [[${nowTime.getTime()}]]; //毫秒

            var startTime = [[${goods.startTime.getTime()}]];

            var endTime = [[${goods.endTime.getTime()}]];

            seckill.func.init(goodsId,nowTime,startTime,endTime);
        })
    </script>

</head>

<body th:inline="text">

    <div th:style="'margin:auto; background-color: whitesmoke; width: 1202px; height: 45px; line-height: 45px;'">
        <div style="margin:auto; float:left; width:1000px;">
            主题频道
            生活助手
            会员服务
            更多热点
            商家入驻
        </div>
        <div style="margin:auto; float:left; width:200px;">
            请登录
            请注册
            商家入驻
        </div>
    </div>

    <div id="content" style="margin:auto; width:1202px;">

        <div style="margin: 10px; height: 75px; line-height: 75px;">
            <div style="float: left; line-height: 50px;"><img th:src="@{/image/logo.png}"></div>
            <div style="float: left; width: 170px;">&nbsp;</div>
            <div style="float: left;line-height: 50px;"><input type="text" style="width: 430px; height: 40px;">&nbsp;&nbsp;搜索</div>
        </div>
    </div>

    <div style="margin:0 auto; width:1202px;">

        <!--左侧的div-->
        <div style="float: left;margin: 18px;">
            <img th:src="${goods.imageUrl}">
        </div>

        <!--右侧的div-->
        <div style="float: left;margin: 18px;">
            <p>
               [[${goods.name}]] [[${goods.nameDesc}]]
            </p>
            <p>
                <span style="color: red;font-size:20px;font-weight: bold;">商品价格： [[${goods.price}]]</span>
            </p>
            <p>
                剩余：[[${goods.store}]] 件
            </p>

            <br/>
            <p id="seckillTip">
               <!--显示秒杀按钮的区域或者倒计时或者秒杀已结束-->
            </p>
        </div>

    </div>

<!--script 位置-->
</body>
</html>